<template>
<xy-page>
  <el-form label-width="144px" :model="detailData">
    <el-form-item label="名称">
      <el-col :span="12">
        <el-input v-model="detailData.name" clearable maxlength="20" placeholder="最长20个字符"></el-input>
      </el-col><span>*</span>
    </el-form-item>
    <el-form-item label="描述">
      <el-col :span="12">
        <el-input type="textarea" v-model="detailData.description" maxlength="200" resize="none" rows="6" placeholder="最长200个字符"></el-input>
      </el-col>
    </el-form-item>
    <el-form-item label="CNAME域名(助教页)">
      <el-col :span="12">
        <el-input v-model="detailData.webappDomain" clearable maxlength="60"></el-input>
      </el-col><span>*</span>
    </el-form-item>
    <el-form-item label="CNAME域名(观看页)">
      <el-col :span="12">
        <el-input v-model="detailData.watchDomain" clearable maxlength="60"></el-input>
      </el-col><span>*</span>
    </el-form-item>
    <el-form-item label="额定并发">
      <el-col :span="12">
        <el-input v-model="detailData.concurrency" type="number" :disabled="true"></el-input>
      </el-col>
    </el-form-item>
    <el-form-item label="创建时间">
      <el-col :span="12">
        <el-date-picker v-model="detailData.createTime" type="date" placeholder="请选择日期" :disabled="true" style="width: 100%;"></el-date-picker>
      </el-col>
    </el-form-item>
    <el-form-item>
      <el-button @click="save" :loading="isSaving" type="primary">保存</el-button>
    </el-form-item>
  </el-form>
</xy-page>
</template>
<script>
export default {
  data() {
    return {
      detailData: {},
      isSaving:false
    };
  },
  methods:{
    save(){
      if(!this.detailData.name || !(this.detailData.name.trim())){
        this.$message.warning('请填写名称')
        return
      }
      if(!this.detailData.webappDomain){
        this.$message.warning('请填写CNAME域名（助教页）')
        return
      }else{
        if(!this.$utils.isCname(this.detailData.webappDomain)){
          this.$message.error('CNAME域名（助教页）格式错误')
          return
        }
      }
      if(!this.detailData.watchDomain){
        this.$message.warning('请填写CNAME域名（观看页）')
        return
      }else{
        if(!this.$utils.isCname(this.detailData.watchDomain)){
          this.$message.error('CNAME域名（观看页）格式错误')
          return
        }
      }
      this.isSaving = true
      this.detailData.appId = this.devAppId
      this.$postStream('/admin/instance/ccb/polyv/app/update.do',{
        data:this.detailData,
        success:(res)=>{
          if(res.success){
            this.$message.success('修改成功')
            this.getData()
            this.isSaving = false
          }else{
            if(res.code == 50001){
              this.$message.error(res.message)
            }else{
              this.$message.error('修改失败')
            }
            this.isSaving = false
          }
        },
        error:()=>{
          this.$message.error('修改失败')
          this.isSaving = false
        }
      })
    },
    getData(){
      this.$postStream('/admin/instance/ccb/polyv/app/get.do', {
        data: {
          appId: this.devAppId
        },
        success: (res)=>{
          if(res.success){
            this.detailData = res.object
          }else{
            this.$message.error('基本信息获取失败')
          }
        },
        error:()=>{
          this.$message.error('基本信息获取失败')
        }
      })
    }
  },
  mounted(){
    this.devAppId = this.$route.query.devAppId
    this.getData()
  }
}
</script>
<style lang="scss" scoped>
i{
  color:red;
  font-size:20px;
  margin-left:10px;
}
span{
  color:red;
  margin-left:10px;
  font-size: 18px;
}
</style>
